//设置通用地址
var base_url = 'http://192.168.3.33:8090';
//加载地图口令
var webKey = "e420b4283c4968c892cfcd839ad2e87c";

// 首先设置好WMTS瓦片地图的投影坐标系,获取WGS84投影坐标系(EPSG4326)，获取墨卡托投影为EPSG3857
var projection = new ol.proj.get("EPSG:4326");
var projectionExtent = projection.getExtent();
var projection2 = new ol.proj.get('EPSG:3857');
var projectionExtent2 = projection2.getExtent();//获取范围


//设置天地图分辨率
var resolutions = [
    1.40625,
    0.703125,
    0.3515625,
    0.17578125,
    0.087890625,
    0.0439453125,
    0.02197265625,
    0.010986328125,
    0.0054931640625,
    0.00274658203125,
    0.001373291015625,
    0.0006866455078125,
    0.00034332275390625,
    0.000171661376953125,
    0.0000858306884765625,
    0.00004291534423828125,
    0.000021457672119140625,
    0.000010728836059570312,
    0.000005364418029785156,
    0.000002682209014892578,
    0.000001341104507446289
];
var resolutions2 = [
    156543.033928041,
    78271.5169640205,
    39135.75848201025,
    19567.879241005125,
    9783.939620502562,
    4891.969810251281,
    2445.9849051256406,
    1222.9924525628203,
    611.4962262814101,
    305.7481131407051,
    152.87405657035254,
    76.43702828517627,
    38.218514142588134,
    19.109257071294067,
    9.554628535647034,
    4.777314267823517,
    2.3886571339117584,
    1.1943285669558792,
    0.5971642834779396,
];

//设置缩放等级
var matrixIds = new Array(21);
for (var z = 0; z < 21; z++) {
    matrixIds[z] = z;
}

//设置地图加载图层_影像底图
var map_img_layer =new ol.layer.Tile({
    opacity: 1,
    preload: Infinity,
    source: new ol.source.WMTS({
        // 影像底图
        url: "http://t0.tianditu.gov.cn/img_c/wmts?tk=" + webKey,
        layer: 'img',
        matrixSet: 'c',
        format: 'tiles',
        style: 'default',
        VERSION:'1.0.0',
        projection: projection,
        maxZoom: 14,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent),
            resolutions: resolutions,
            matrixIds: matrixIds
        }),
        wrapX: false
    })

});
var map_img_layer_slj =new ol.layer.Tile({
    opacity: 1,
    preload: Infinity,
    // source: new XYZ({
    //   url:  'http://t0.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk='+webKey
    // })
    source: new ol.source.WMTS({
        // 影像底图
        url: "http://10.66.241.240:808/img_w/wmts?tk=42a5dfa93ea7a9cbf423c4c1bb9ec16d&tilematrixset=w",
        layer: 'img',
        //matrixSet: 'c',
        format: 'tiles',
        style: 'default',
        Service:'WMTS',
        Request:'GetTile',
        VERSION:'1.0.0',
        projection: projection2,
        maxZoom: 14,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent2),
            resolutions: resolutions2,
            matrixIds: matrixIds
        }),
        wrapX: false
    })

});

//设置地图加载图层_影像注记图层
var map_img_layer_lettering = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        url: "http://t0.tianditu.gov.cn/cia_c/wmts?tk=" + webKey,
        layer: 'cia',
        matrixSet: 'c',
        format: 'tiles',
        VERSION:'1.0.0',
        style: 'default',
        projection: projection,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent),
            extent: [-180.0, -90.0, 180.0, 90.0],
            resolutions: resolutions,
            matrixIds: matrixIds
        }),
        wrapX: false
    })

});
var map_img_layer_lettering_slj = new ol.layer.Tile({
    opacity: 1,
    preload: Infinity,
    // source: new XYZ({
    //   url:  'http://t0.tianditu.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk='+webKey
    // })
    source: new ol.source.WMTS({
        // 影像底图
        url: "http://10.66.241.240:808/cia_w/wmts?tk=42a5dfa93ea7a9cbf423c4c1bb9ec16d&tilematrixset=w",
        layer: 'cia',
        //matrixSet: 'c',
        format: 'tiles',
        style: 'default',
        Service:'WMTS',
        Request:'GetTile',
        VERSION:'1.0.0',
        projection: projection2,
        maxZoom: 14,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent2),
            resolutions: resolutions2,
            matrixIds: matrixIds
        }),
        wrapX: false
    })

});

//设置地图加载图层_矢量底图
var map_vector_layer = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://t0.tianditu.gov.cn/vec_c/wmts?tk=" + webKey,
        layer: 'vec',
        matrixSet: 'c',
        format: 'tiles',
        style: 'default',

        projection: projection,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent),
            resolutions: resolutions,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});
var map_vector_layer_slj = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.240:808/ter_w/wmts?tk=42a5dfa93ea7a9cbf423c4c1bb9ec16d&tilematrixset=w&Format=tiles",
        layer: 'ter',
        //matrixSet: 'c',
        format: 'tiles',
        style: 'default',
        Service:'WMTS',
        Request:'GetTile',
        Version:'1.0.0',
        tk: '42a5dfa93ea7a9cbf423c4c1bb9ec16d',
        projection: projection2,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent2),
            resolutions: resolutions2,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});
//设置地图加载图层_矢量注记图层
var map_vector_layer_lettering = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量注记
        url: "http://t0.tianditu.gov.cn/cva_c/wmts?tk=" + webKey,
        layer: 'cva',
        matrixSet: 'c',
        format: 'tiles',
        style: 'default',
        projection: projection,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent),
            extent: [-180.0, -90.0, 180.0, 90.0],
            resolutions: resolutions,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});



//记录被选中的图层-图层状态
var layer_selected = [2];


//添加supermap相关图层
var nice_division_url_hl = base_url+ '/iserver/services/map-DriverNote/rest/maps/nineDivision';
var nice_division_url_sz = base_url+ '/iserver/services/map-Dshuizha/rest/maps/nineDivision';
var nice_division_url_qd = base_url+ '/iserver/services/map-Dqudao/rest/maps/nineDivision';
var nice_division_url_gqcsd = base_url+ '/iserver/services/map-Dguangai/rest/maps/nineDivision';
var nice_division_url_swcz = base_url+ '/iserver/services/map-DjiancezhanNote/rest/maps/nineDivision';
var nice_division_url_jdj = base_url+ '/iserver/services/map-Djijing/rest/maps/nineDivision';
var nice_division_url_rygc = base_url+ '/iserver/services/map-Drenyin/rest/maps/nineDivision';
var nice_division_url_sk = base_url+ '/iserver/services/map-Dshuiku/rest/maps/nineDivision';
var nice_division_url_tqh = base_url+ '/iserver/services/map-Dquhuaxingzhuang/rest/maps/heliu@Datasource';
var nice_division_url_tqhnote = base_url+ '/iserver/services/map-DtuanNote/rest/maps/nineDivision';

//九师河流
var nine_division_layer_hl = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_hl,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师水闸
var nine_division_layer_sz = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_sz,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师水库
var nine_division_layer_sk = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_sk,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师渠道
var nine_division_layer_qd = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_qd,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师人饮工程
var nine_division_layer_rygc = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_rygc,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师水文测站
var nine_division_layer_swcz = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_swcz,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师地下水机井
var nine_division_layer_jdj = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_jdj,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师灌区测水点
var nine_division_layer_gqcsd = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_gqcsd,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师团级区划
var nine_division_layer_tqh = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_tqh,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});

//九师团级区划_注记
var nine_division_layer_tqhnote = new ol.layer.Tile({
    source: new ol.source.TileSuperMapRest({
        url: nice_division_url_tqhnote,
        wrapX: true
    }),
    projection: 'EPSG:4326'
});


//设置初始化缩放，及中心位置
var view1 = new ol.View({
    center: [83.8, 46.40],
    zoom: 9,
    minZoom: 5,
    maxZoom: 19,
    projection: "EPSG:4326",
    multiWorld: true,
});

//将图层加载到地图上
var map = new ol.Map({
    controls: ol.control.defaults({
        attribution: false,
        zoom: false,
        rotate: false
    }),
    target: 'map',
    view: view1,
    // layers: [
    //     new ol.layer.Tile({
    //         preload: 4,
    //         source: new ol.source.OSM()
    //     })
    // ],
    layers:[map_img_layer],
    //overlays:[overlay],
});

// 擦除操作,生产遮罩范围
function erase(geom) {
    var extent = [-180,-90,180,90];
    var polygonRing = ol.geom.Polygon.fromExtent(extent);
    var coords = geom.getCoordinates();
    coords.forEach(coord =>{
        var linearRing = new ol.geom.LinearRing(coord[0]);
        polygonRing.appendLinearRing(linearRing);
    });
    return polygonRing;
}

//添加遮罩
function addconver(data) {
    $.getJSON(data, function(data) {
        var fts = new ol.format.GeoJSON().readFeatures(data);
        var ft = fts[0];
        var converGeom = erase(ft.getGeometry());
        var convertFt = new ol.Feature({
            geometry: converGeom
        });
        converLayer.getSource().addFeature(convertFt);
    })
}


var dataURL = 'json/xj.json';
addconver(dataURL);

var mystyle = new ol.style.Style({
    fill: new ol.style.Fill({
        color:"#000a3f82",
    }),
    stroke: new ol.style.Stroke({
        color:"#663403",
        width:'0px',
    })
});

var converLayer = new ol.layer.Vector({
    source: new ol.source.Vector(),
    style: mystyle
});

//九师四清数据
map.addLayer(map_vector_layer_slj);
//map.addLayer(map_vector_layer_lettering);
map_vector_layer_slj.setVisible(false);
//map_vector_layer_lettering.setVisible(false);
map.addLayer(nine_division_layer_tqh);
nine_division_layer_tqh.setVisible(false);
map.addLayer(nine_division_layer_hl);
nine_division_layer_hl.setVisible(false);
map.addLayer(nine_division_layer_sz);
nine_division_layer_sz.setVisible(false);
map.addLayer(nine_division_layer_sk);
nine_division_layer_sk.setVisible(false);
map.addLayer(nine_division_layer_qd);
nine_division_layer_qd.setVisible(false);
map.addLayer(nine_division_layer_rygc);
nine_division_layer_rygc.setVisible(false);
map.addLayer(nine_division_layer_swcz);
nine_division_layer_swcz.setVisible(false);
map.addLayer(nine_division_layer_jdj);
nine_division_layer_jdj.setVisible(false);
map.addLayer(nine_division_layer_gqcsd);
nine_division_layer_gqcsd.setVisible(false);
map.addLayer(nine_division_layer_tqhnote);
nine_division_layer_tqhnote.setVisible(false);
//天地图影像注记
map.addLayer(map_img_layer_lettering_slj);
map_img_layer_lettering_slj.setVisible(false);

//兵团一张图数据
// 首先设置好WMTS瓦片地图的投影坐标系,获取WGS84投影坐标系(EPSG4326)，获取墨卡托投影为EPSG3857
var projection1 = new ol.proj.get('EPSG:3857');
var projectionExtent1 = projection1.getExtent();//获取范围

var matrixIds_b = new Array(19);
for (var z = 0; z < 19; z++) {
    matrixIds_b[z] = z;
}

var resolutions1 = [
    156543.033928041,
    78271.5169640205,
    39135.75848201025,
    19567.879241005125,
    9783.939620502562,
    4891.969810251281,
    2445.9849051256406,
    1222.9924525628203,
    611.4962262814101,
    305.7481131407051,
    152.87405657035254,
    76.43702828517627,
    38.218514142588134,
    19.109257071294067,
    9.554628535647034,
    4.777314267823517,
    2.3886571339117584,
    1.1943285669558792,
    0.5971642834779396,
];

//灌区
var map_vector_layer_IRR_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'IRR_R_B',
        matrixSet: 'GoogleMapsCompatible_IRR_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds_b
        }),
        wrapX: false
    })
});
map.addLayer(map_vector_layer_IRR_R_B);
map_vector_layer_IRR_R_B.setVisible(false);

// 河湖
var map_vector_layer_RV_LK_R = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-HHKQ20190813/wmts100",
        layer: 'RV_LK_R',
        matrixSet: 'GoogleMapsCompatible_RV_LK_R',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds_b
        }),
        wrapX: false
    })
});
map.addLayer(map_vector_layer_RV_LK_R);

//  干渠道--影像 兵团
var map_vector_layer_CHAN_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'CHAN_R_B',
        matrixSet: 'GoogleMapsCompatible_CHAN_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_CHAN_R_B);
map_vector_layer_CHAN_R_B.setVisible(false);

// 斗渠-影像
var map_vector_layer_DOUQ_R = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'DOUQ_R',
        matrixSet: 'GoogleMapsCompatible_DOUQ_R',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_DOUQ_R);
map_vector_layer_DOUQ_R.setVisible(false);

// 首部-影像
var map_vector_layer_SHBU_R = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'SHBU_R',
        matrixSet: 'GoogleMapsCompatible_SHBU_R',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_SHBU_R);
map_vector_layer_SHBU_R.setVisible(false);

//  机电井--影像 兵团
var map_vector_layer_WELL_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'WELL_R_B',
        matrixSet: 'GoogleMapsCompatible_WELL_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_WELL_R_B);
map_vector_layer_WELL_R_B.setVisible(false);

//  人工饮程--影像 兵团
var map_vector_layer_CWS_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'CWS_R_B',
        matrixSet: 'GoogleMapsCompatible_CWS_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_CWS_R_B);
map_vector_layer_CWS_R_B.setVisible(false);

// 水库BT 影像
var map_vector_layer_RES_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-HHKQ20190813/wmts100",
        layer: 'RES_R_B',
        matrixSet: 'GoogleMapsCompatible_RES_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_RES_R_B);
map_vector_layer_RES_R_B.setVisible(false);





// //九师水库_兵团一张图
//     var nine_division_layer_sk_yzt = new ol.layer.Tile({
//         source: new ol.source.TileSuperMapRest({
//             url: "http://10.66.241.217:8090/iserver/services/map-HHKQ20190813/rest/maps/RES_V_B?prjCoordSys={%22epsgCode%22:4326}",
//             wrapX: true
//         }),
//         projection: 'EPSG:4326'
//     });
// map.addLayer(nine_division_layer_sk_yzt);

//  水电站--影像  兵团
var map_vector_layer_HYST_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'HYST_R_B',
        matrixSet: 'GoogleMapsCompatible_HYST_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_HYST_R_B);
map_vector_layer_HYST_R_B.setVisible(false);

//  水闸 --影像 兵团
var map_vector_layer_WAGA_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'WAGA_R_B',
        matrixSet: 'GoogleMapsCompatible_WAGA_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_WAGA_R_B);
map_vector_layer_WAGA_R_B.setVisible(false);

//  泵站--影像  兵团
var map_vector_layer_PUST_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'PUST_R_B',
        matrixSet: 'GoogleMapsCompatible_PUST_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_PUST_R_B);
map_vector_layer_PUST_R_B.setVisible(false);

//  提防--影像  兵团
var map_vector_layer_DIKE_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'DIKE_R_B',
        matrixSet: 'GoogleMapsCompatible_DIKE_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_DIKE_R_B);
map_vector_layer_DIKE_R_B.setVisible(false);

//  泄洪通道--影像
var map_vector_layer_XHTD_R = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-SLGC20190814/wmts100",
        layer: 'XHTD_R',
        matrixSet: 'GoogleMapsCompatible_XHTD_R',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_XHTD_R);
map_vector_layer_XHTD_R.setVisible(false);

// 测站 --影像
var map_vector_layer_ST_R = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-JCSS20190830/wmts100",
        layer: 'ST_R',
        matrixSet: 'GoogleMapsCompatible_ST_R',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_ST_R);
map_vector_layer_ST_R.setVisible(false);

// 分水计量点-影像
var map_vector_layer_FSJL_R = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-JCSS20190830/wmts100",
        layer: 'FSJL_R',
        matrixSet: 'GoogleMapsCompatible_FSJL_R',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_FSJL_R);
map_vector_layer_FSJL_R.setVisible(false);

//取水口-影像兵团
var map_vector_layer_WAIN_R_B = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-QPSK/wmts100",
        layer: 'WAIN_R_B',
        matrixSet: 'GoogleMapsCompatible_WAIN_R_B',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_WAIN_R_B);
map_vector_layer_WAIN_R_B.setVisible(false);

// 行政区划--影像
var map_vector_layer_AD_R_20210419 = new ol.layer.Tile({
    opacity: 1,
    source: new ol.source.WMTS({
        // 矢量图层
        url: "http://10.66.241.217:8090/iserver/services/map-XZQH/wmts100",
        layer: 'AD_R_20210419',
        matrixSet: 'GoogleMapsCompatible_AD_R_20210419',
        format: 'image/png',
        style: 'default',
        Service:'wmts',
        Request:'GetTile',
        Version:'1.0.0',
        projection: projection1,
        tileGrid: new ol.tilegrid.WMTS({
            origin: ol.extent.getTopLeft(projectionExtent1),
            resolutions: resolutions1,
            matrixIds: matrixIds
        }),
        wrapX: false
    })
});

map.addLayer(map_vector_layer_AD_R_20210419);
map_vector_layer_AD_R_20210419.setVisible(false);


map.addLayer(converLayer);

// //地图量算图层
//定义矢量数据源
// var source = new ol.source.Vector({wrapX: false});
//
// //定义矢量图层
// var vectorLayer = new ol.layer.Vector({
//     source: source,
//     style: new ol.style.Style({
//         fill: new ol.style.Fill({
//             color:'rgba(255,255,255,0.4)'
//         }),
//         stroke: new ol.style.Stroke({
//             color: '#e21e0a',
//             width:3
//         }),
//         image: new ol.style.Circle({
//             radius: 5,
//             fill: new ol.style.Fill({
//                 color:'#ffcc33'
//             })
//         })
//     })
// });
// map.addLayer(vectorLayer);
//
// var interaction = new ol.interaction.Draw({
//     source: source,
//     type: "LineString",
//     style:new ol.style.Style({
//         stroke:new ol.style.Stroke({
//             color:'#ffcc33',
//             width:2
//         })
//     })
// });
// var featrue;
// interaction.on('drawstart', function (evt) {
//     feature = evt.feature;
// });
// interaction.on('drawend', function () {
//     var distanceMeasureParam = new SuperMap.MeasureParameters(feature.getGeometry());
//     new ol.supermap.MeasureService(nice_division_url_hl, {measureMode: ""}).measureDistance(distanceMeasureParam, function (serviceResult) {
//         alert(serviceResult.result.distance + resources.msg_m, true);
//     });
// });
// map.addInteraction(interaction);





//定义矢量数据源
var raster = new ol.layer.Tile({
    source: new ol.source.OSM()
});
var source = new ol.source.Vector({wrapX: false});
//定义矢量图层
var vectorLayer = new ol.layer.Vector({
    source: source,
    style: new ol.style.Style({
        fill: new ol.style.Fill({
            color:'rgba(255,255,255,0.4)'
        }),
        stroke: new ol.style.Stroke({
            color: '#fa8100',
            width:3
        }),
        image: new ol.style.Circle({
            radius: 5,
            fill: new ol.style.Fill({
                color:'#ffcc33'
            })
        })
    })
});


map.addLayer(vectorLayer);


/**
 * Currently drawn feature.
 * @type {module:ol/Feature~Feature}
 */
var sketch=new ol.Feature();


/**
 * The help tooltip element.
 * @type {Element}
 */
var helpTooltipElement;


/**
 * Overlay to show the help messages.
 * @type {module:ol/Overlay}
 */
var helpTooltip;


/**
 * The measure tooltip element.
 * @type {Element}
 */
var measureTooltipElement;


/**
 * Overlay to show the measurement.
 * @type {module:ol/Overlay}
 */
var measureTooltip;


/**
 * Message to show when the user is drawing a polygon.
 * @type {string}
 */
var continuePolygonMsg = '点击继续测量面积';


/**
 * Message to show when the user is drawing a line.
 * @type {string}
 */
var continueLineMsg = '点击继续测量距离';


/**
 * Handle pointer move.
 * @param {module:ol/MapBrowserEvent~MapBrowserEvent} evt The event.
 */
var pointerMoveHandler = function(evt) {
    if (evt.dragging) {
        return;
    }
    /** @type {string} */
    var helpMsg = '点击开始测量';

    if (sketch) {
        var geom = (sketch.getGeometry());
        if (geom instanceof ol.geom.Polygon) {
            helpMsg = continuePolygonMsg;
        } else if (geom instanceof ol.geom.LineString) {
            helpMsg = continueLineMsg;
        }
    }

    helpTooltipElement.innerHTML = helpMsg;
    helpTooltip.setPosition(evt.coordinate);

    helpTooltipElement.classList.remove('hidden');
};


// map.on('pointermove', pointerMoveHandler);
//
// map.getViewport().addEventListener('mouseout', function() {
//     helpTooltipElement.classList.add('hidden');
// });

var typeSelect = document.getElementById('type');

var draw; // global so we can remove it later


/**
 * Format length output.
 * @param {module:ol/geom/LineString~LineString} line The line.
 * @return {string} The formatted length.
 */
var formatLength = function(line) {
    var length = ol.sphere.getLength(line);
    var output;
    if (length > 100) {
        output = (Math.round((length / 1000 * 100)*100))/100 +
            ' ' + 'km';
    } else {
        output = (Math.round((length * 100)*100))/100 +
            ' ' + 'km';
    }
    return output;
};


/**
 * Format area output.
 * @param {module:ol/geom/Polygon~Polygon} polygon The polygon.
 * @return {string} Formatted area.
 */
var formatArea = function(polygon) {
    var area = ol.sphere.getArea(polygon);
    var output;
    if (area > 10000) {
        output = (Math.round((area / 1000000 * 100000)*100)/100) +
            ' ' + 'km<sup>2</sup>';
    } else {
        output = (Math.round((area * 100000)*100)/100) +
            ' ' + 'km<sup>2</sup>';
    }
    return output;
};

function addInteraction(id) {
    var type = 'LineString';
    if (id==0){
        type = 'LineString';
    }else {
        type = 'Polygon';
    }
    draw = new ol.interaction.Draw({
        source: source,
        type: type,
        style: new ol.style.Style({
            fill: new ol.style.Fill({
                color: '#ffffff7a'
            }),
            stroke: new ol.style.Stroke({
                color: '#e21e0a',
                lineDash: [10, 10],
                width: 2
            }),
            image: new ol.style.Circle({
                radius: 5,
                stroke: new ol.style.Stroke({
                    color: '#09f'
                }),
                fill: new ol.style.Fill({
                    color: '#0099ff6b'
                })
            })
        })
    });
    map.addInteraction(draw);

    createMeasureTooltip();
    createHelpTooltip();

    var listener;
    draw.on('drawstart', function(evt) {
            // set sketch
            sketch = evt.feature;

            /** @type {module:ol/coordinate~Coordinate|undefined} */
            var tooltipCoord = evt.coordinate;

            listener = sketch.getGeometry().on('change', function(evt) {
                var geom = evt.target;
                var output;
                if (geom instanceof ol.geom.Polygon) {
                    output = formatArea(geom);
                    tooltipCoord = geom.getInteriorPoint().getCoordinates();
                } else if (geom instanceof ol.geom.LineString) {
                    output = formatLength(geom);
                    tooltipCoord = geom.getLastCoordinate();
                }
                measureTooltipElement.innerHTML = output;
                measureTooltip.setPosition(tooltipCoord);
            });
        }, this);

    draw.on('drawend', function() {
            measureTooltipElement.className = 'tooltip tooltip-static';
            measureTooltip.setOffset([0, -7]);
            // unset sketch
            sketch = null;
            // unset tooltip so that a new one can be created
            measureTooltipElement = null;
            createMeasureTooltip();
            ol.Observable.unByKey(listener);
        }, this);
}


/**
 * Creates a new help tooltip
 */
function createHelpTooltip() {
    if (helpTooltipElement) {
        helpTooltipElement.parentNode.removeChild(helpTooltipElement);
    }
    helpTooltipElement = document.createElement('div');
    helpTooltipElement.className = 'tooltip hidden';
    helpTooltip = new ol.Overlay({
        element: helpTooltipElement,
        offset: [15, 0],
        positioning: 'center-left'
    });
    map.addOverlay(helpTooltip);
}


/**
 * Creates a new measure tooltip
 */
function createMeasureTooltip() {
    if (measureTooltipElement) {
        measureTooltipElement.parentNode.removeChild(measureTooltipElement);
    }
    measureTooltipElement = document.createElement('div');
    measureTooltipElement.className = 'tooltip tooltip-measure';
    measureTooltip = new ol.Overlay({
        element: measureTooltipElement,
        offset: [0, -15],
        positioning: 'bottom-center'
    });
    map.addOverlay(measureTooltip);
}


//图层切换函数
function layerChange(id) {
        if (id==0){
            $("#type_c0").css("border","3px solid #28e5e9");
            $("#type_c1").css("border","0px");
            map_img_layer.setVisible(true);
            map_vector_layer_slj.setVisible(false);
        }else if (id==1) {
            $("#type_c0").css("border","0px");
            $("#type_c1").css("border","3px solid #28e5e9");
            map_img_layer.setVisible(false);
            map_vector_layer_slj.setVisible(true);
        }else {
            show_other_layer('其他图层列表','other_layer.html');
        }

}

//工具箱切换函数
var mesure_key=0;
function toolChange(id) {
    if(id==0){
        $("#right_1").css('display','none');
        $("#right_2").css('display','none');
        $("#right_3").css('display','none');
        $("#right_5").css('display','block');
        informationChange(0);
    }else if (id==1){
        $("#right_1").css('display','none');
        $("#right_2").css('display','none');
        $("#right_3").css('display','none');
        $("#right_4").css('display','block');
        elementChange(0);
    }else if(id==2){
        $("#water_monitor").css('display','none');
        $("#element_search").css('display','none');
        $("#other_tool").css('display','none');
        $("#measure_box").css('display','block');
        $("#close_measure").css('display','block');
        mesure_key = map.on('pointermove', pointerMoveHandler);
        map.getViewport().addEventListener('mouseout', function() {
        helpTooltipElement.classList.add('hidden');
        });
        addInteraction(0);
        ol.Observable.unByKey(search_key);

    }

}

//关闭地图测量工具箱
function close_measure() {
    $("#length_measure").css("border","3px solid #28e5e9");
    $("#polygon_measure").css("border","0px");
    $("#water_monitor").css('display','block');
    $("#element_search").css('display','block');
    $("#other_tool").css('display','block');
    $("#measure_box").css('display','none');
    $("#close_measure").css('display','none');
    ol.Observable.unByKey(mesure_key);
    map.getViewport().removeEventListener('mouseout', function() {
        helpTooltipElement.classList.add('hidden');
    });
    map.removeInteraction(draw);
    $('.ol-overlaycontainer-stopevent').empty();
    search_key =  map.on('singleclick', function(evt) {
        getinfobyPoint(evt);
    });

}

//清除已测线和面
var measure_memory = 0;
function measureChange(id) {
    if (id==0){
        $("#length_measure").css("border","3px solid #28e5e9");
        $("#polygon_measure").css("border","0px");
        map.removeInteraction(draw);
        addInteraction(id);
        measure_memory=id;

    }else if (id==1) {
        $("#length_measure").css("border","0px");
        $("#polygon_measure").css("border","3px solid #28e5e9");
        map.removeInteraction(draw);
        addInteraction(id);
        measure_memory=id;

    }else {
        vectorLayer.getSource().clear();
        $('.ol-overlaycontainer-stopevent').empty();
        map.removeInteraction(draw);
        addInteraction(measure_memory);
    }
}




//其他图层-单独窗口展示
function show_other_layer(title,url) {
    var index = layer.open({
        type: 2,
        area: ['320px', '625px'],
        fix: false, //不固定
        offset:'120px',
        btnAlign: 'c',
        btn:['确定'],
        closeBtn:1,
        shadeClose: true,
        shade:0.4,
        title: title,
        content: url,
        success:function (layero, index) {
            //打开界面后的操作
            var body = layer.getChildFrame('body', index);
            localStorage.setItem('layer_selected',JSON.stringify(layer_selected));
        },
        yes: function(index, layero){
            layer_selected.splice(0,layer_selected.length);
            var cheakData = JSON.parse(localStorage.getItem('checkData'));
            for(var i=0;i<cheakData.length;i++){
                layer_selected[i] = cheakData[i].id;
            }
            //图层显示标记
            var layer_show = 0;
            for (var i=0;i<18;i++){
                for(var j=0;j<layer_selected.length;j++){
                    if (i==layer_selected[j]){
                        switch(i) {
                            case 0:
                                map_vector_layer_AD_R_20210419.setVisible(true);
                                break;
                            case 1:
                                map_img_layer_lettering_slj.setVisible(true);
                                break;
                            case 2:
                                map_vector_layer_RV_LK_R.setVisible(true);
                                break;
                            case 3:
                                map_vector_layer_CHAN_R_B.setVisible(true);
                                break;
                            case 4:
                                map_vector_layer_DOUQ_R.setVisible(true);
                                break;
                            case 5:
                                map_vector_layer_SHBU_R.setVisible(true);
                                break;
                            case 6:
                                map_vector_layer_WELL_R_B.setVisible(true);
                                break;
                            case 7:
                                map_vector_layer_CWS_R_B.setVisible(true);
                                break;
                            case 8:
                                map_vector_layer_RES_R_B.setVisible(true);
                                break;
                            case 9:
                                map_vector_layer_HYST_R_B.setVisible(true);
                                break;
                            case 10:
                                map_vector_layer_WAGA_R_B.setVisible(true);
                                break;
                            case 11:
                                map_vector_layer_PUST_R_B.setVisible(true);
                                break;
                            case 12:
                                map_vector_layer_DIKE_R_B.setVisible(true);
                                break;
                            case 13:
                                map_vector_layer_XHTD_R.setVisible(true);
                                break;
                            case 14:
                                map_vector_layer_ST_R.setVisible(true);
                                break;
                            case 15:
                                map_vector_layer_FSJL_R.setVisible(true);
                                break;
                            case 16:
                                map_vector_layer_WAIN_R_B.setVisible(true);
                            case 17:
                                map_vector_layer_IRR_R_B.setVisible(true);
                                break;
                        }
                        layer_show=1;
                        break;
                    }
                }
                if (layer_show==0){
                    switch(i) {
                        case 0:
                            map_vector_layer_AD_R_20210419.setVisible(false);
                            break;
                        case 1:
                            map_img_layer_lettering_slj.setVisible(false);
                            break;
                        case 2:
                            map_vector_layer_RV_LK_R.setVisible(false);
                            break;
                        case 3:
                            map_vector_layer_CHAN_R_B.setVisible(false);
                            break;
                        case 4:
                            map_vector_layer_DOUQ_R.setVisible(false);
                            break;
                        case 5:
                            map_vector_layer_SHBU_R.setVisible(false);
                            break;
                        case 6:
                            map_vector_layer_WELL_R_B.setVisible(false);
                            break;
                        case 7:
                            map_vector_layer_CWS_R_B.setVisible(false);
                            break;
                        case 8:
                            map_vector_layer_RES_R_B.setVisible(false);
                            break;
                        case 9:
                            map_vector_layer_HYST_R_B.setVisible(false);
                            break;
                        case 10:
                            map_vector_layer_WAGA_R_B.setVisible(false);
                            break;
                        case 11:
                            map_vector_layer_PUST_R_B.setVisible(false);
                            break;
                        case 12:
                            map_vector_layer_DIKE_R_B.setVisible(false);
                            break;
                        case 13:
                            map_vector_layer_XHTD_R.setVisible(false);
                            break;
                        case 14:
                            map_vector_layer_ST_R.setVisible(false);
                            break;
                        case 15:
                            map_vector_layer_FSJL_R.setVisible(false);
                            break;
                        case 16:
                            map_vector_layer_WAIN_R_B.setVisible(false);
                        case 17:
                            map_vector_layer_IRR_R_B.setVisible(false);
                            break;
                    }
                }else {
                    layer_show=0;
                }
            }
            layer.close(index);
        }
    });
}

//地图查询-要素弹出层
var container = document.getElementById('popup');
var content = document.getElementById('popup-content');
var closer = document.getElementById('popup-closer');

var overlay_water_element = new ol.Overlay({
    element: container,
    autoPan: true,
    autoPanAnimation: {
        duration: 250
    }
});

map.addOverlay(overlay_water_element);

closer.onclick = function() {
    overlay_water_element.setPosition(undefined);
    closer.blur();
    return false;
};

//地图定位-要素弹出层
var location_container = document.getElementById('element_popup');
var location_closer = document.getElementById('element_popup-closer');

var projectContainer = document.getElementById('projectPopup');
var projectCloser = document.getElementById('projectPopupCloser');

var overlay_map_element = new ol.Overlay({
    element: location_container,
});
map.addOverlay(overlay_map_element);

var overlayMapProject = new ol.Overlay({
    element: projectContainer,
});
map.addOverlay(overlayMapProject);

location_closer.onclick = function() {
    overlay_map_element.setPosition(undefined);
    location_closer.blur();
    vectorSource.clear();
    return false;
};

projectCloser.onclick = function() {
    overlayMapProject.setPosition(undefined);
    projectCloser.blur();
    return false;
};

var search_key =  map.on('singleclick', function(evt) {
    getinfobyPoint(evt);

});


var getSpatialCount_parameter='{"userId":"f439de16-db47-42aa-938e-e72c203ed5e0","subjectId":"5d731cc2-a388-4a29-ada6-af50ae09d069","location":"POLYGON((84.19509887695311 46.85326522131447,84.20196533203124 46.85326522131447,84.20196533203124 46.84856925941577,84.19509887695311 46.84856925941577,84.19509887695311 46.85326522131447))","layers":[{"elementType":"irr","index":2},{"elementType":"rvlk","index":3},{"elementType":"rswb","index":3}],"elementType":"","func":"singleclick","zoom":12,"addvcd":"660000","bbox":"84.19509887695311,46.84856925941577,84.20196533203124,46.85326522131447"}';
var select_parameter={};
var getSortList_parameter={};
var getSpatialData_parameter={};
var getSpaceData_parameter={};
var getDetail_parameter={};
//大地坐标系资料WGS-84 长半径a=6378137 短半径b=6356752.3142 扁率f=1/298.2572236,半径是6371.393
var EARTH_RADIUS = 6371.393;

//度换成弧度
function rad(d) {
    return d * Math.PI / 180.0;
}

/*
 根据原点向右平移指定距离（纬度不变，经度变化）
 lon 经度
 lat 纬度
 dist 距离，单位：米
 */
function  move_right(lon, lat, dist) {
    var d = dist / (EARTH_RADIUS * 1000);
    var cs = Math.cos(rad(lat));
    var c = d / cs * 180.0 / Math.PI;
    return  (lon + c);
}

function  move_left(lon, lat, dist) {
    var d = dist / (EARTH_RADIUS * 1000);
    var cs = Math.cos(rad(lat));
    var c = d / cs * 180.0 / Math.PI;
    return  (lon - c);
}

/*
根据原点向上平移指定距离（经度不变，纬度变化）
lon 经度
lat 纬度
dist 距离，单位：米
 */
function move_top(lon, lat, dist) {
    var d = dist / (EARTH_RADIUS * 1000);
    var c = d / Math.PI * 180.0;
    return (lat + c);
}

function move_down(lon, lat, dist) {
    var d = dist / (EARTH_RADIUS * 1000);
    var c = d / Math.PI * 180.0;
    return (lat - c);
}

var getSpatialCount_return='';
var select_p_return='';
var getSortList_return='';
var getSpatialData_return='';
var getSpaceData_return='';
var getDeatil_return='';
function getinfobyPoint(evt) {
    // if ($('.ol-overlaycontainer-stopevent').children().length==0){
    //     overlay_map_element = new ol.Overlay({
    //         element: location_container,
    //     });
    //     map.addOverlay(overlay_map_element);
    // }
    //未开启地图点击查询则不查询
    if(!app_map.value_switch){
        return;
    }
    app_map.openFullScreen3();
    //超出地图范围，不查询信息
    //x经度
    var x = evt.coordinate[0];
    //y纬度
    var y = evt.coordinate[1];
    if (x < -180.0 || x > 180.0 || y < -90 || y > 90) {
        return;
    }
    //确定访问的数据集
    //query(x,y);
    //经度右移
    var lon_1=move_right(x, y, 50);
    var lon_3=move_right(x,y,45);
    //纬度上移
    var lat_1=move_top(x,y,50);
    var lat_3=move_top(x,y,1200);
    //经度左移
    var lon_2=move_left(x, y, 50);
    //纬度下移
    var lat_2=move_down(x,y,50);
    var zoom_p = map.getView().getZoom();
    //重新设定bbox zoom
    //第一步getSpatialCount 确定点击对象
    getSpatialCount_parameter='{"userId":"f439de16-db47-42aa-938e-e72c203ed5e0","subjectId":"5d731cc2-a388-4a29-ada6-af50ae09d069","location":"POLYGON(('+lon_2+' '+lat_1 +','+lon_1+' '+lat_1+','+lon_1+' '+lat_2+','+lon_2+' '+lat_2+','+lon_2+' '+lat_1+'))","layers":[{"elementType":"irr","index":2},{"elementType":"rvlk","index":3},{"elementType":"rswb","index":3},{"elementType":"ggqd","index":12},{"elementType":"gate","index":22}],"elementType":"","func":"singleclick","zoom":'+zoom_p+',"addvcd":"660000","bbox":"'+lon_2+','+lat_2+','+lon_1+','+lat_1+'"}';
    getSpatialCount(getSpatialCount_parameter,lon_1,lon_3,lat_1,lat_3,lon_2,lat_2,x,y,zoom_p);

}

var vectorSource = new ol.source.Vector();
var vectorLayer = new ol.layer.Vector({
    source: vectorSource,
    zIndex:999,
});
map.addLayer(vectorLayer);

//点击后显示点击处的地物信息
function click_element_location(x,y,lon_3,lat_3,getDeatil_return) {
    //填写要素信息
    $('#element_name').empty();
    $('#element_name').html(getDeatil_return[1].value);
    $('#project_detail').empty();
    //写入工程具体信息
    for(var i=0;i<getDeatil_return.length;i++){
        $('#project_detail').append('<tr> <td>'+getDeatil_return[i].title+'</td> <td>'+getDeatil_return[i].value+'</td></tr>');
    }

    //地图添加要素信息
    overlay_map_element.setPosition([x,y]);
    overlayMapProject.setPosition(undefined);
    //地图中心位置移动
    map.getView().animate({
        duration: 800,
        center: [lon_3,lat_3],
    },{
        zoom: 15
    });

}




// //定义所有可查询图层
// var layer_data_all = ['shuiku@Datasource','shuizha@Datasource','renyin@Datasource','dixiashui@Datasource','guanquceshui@Datasource','qudao@Datasource','tuanchang@Datasource'];
// var layer_map_all = [base_url+'/iserver/services/map-Dshuiku/rest/maps/nineDivision',base_url+'/iserver/services/map-Dshuizha/rest/maps/nineDivision',base_url+'/iserver/services/map-Drenyin/rest/maps/nineDivision',base_url+'/iserver/services/map-Djijing/rest/maps/nineDivision',base_url+'/iserver/services/map-Dguangai/rest/maps/nineDivision',base_url+'/iserver/services/map-Dqudao/rest/maps/nineDivision',base_url+'/iserver/services/map-Dquhuaxingzhuang/rest/maps/heliu@Datasource',];
// function query(x,y) {
//     //添加查询中心点
//     var point = new ol.geom.Point([x, y]);
//
//     //分别查询8类图层，并返回第一个被查询到的对象,依次查询，水库、河流、水闸、人饮工程、水文测站、地下水机井、灌区测水点、渠道、团级行政区划
//     for (var i=0;i<1;i++){
//         var param = new SuperMap.QueryByDistanceParameters({
//             queryParams: {name: 'T01RES_20211027@HHKQ20190813.4'},
//             distance: 0.00008,
//             geometry: point
//         });
//         //创建距离查询实例
//         var search_result = 0;
//         var search_break = 0;
//         var search_properties = 0;
//         new ol.supermap.QueryService('http://10.66.241.217:8090/iserver/services/map-HHKQ20190813/rest/maps/RES_V_B?prjCoordSys={%22epsgCode%22:4326}').queryByDistance(param, function (serviceResult) {
//             console.log(serviceResult);
//             search_result = serviceResult.result;
//             // if (search_result.recordsets[0].features.features.length!=0){
//             //     //只有在属性不为0的情况下，才抓取属性值
//             //     search_properties = search_result.recordsets[0].features.features[0].properties;
//             //     //设置判断条件，保证只显示第一个被查出来的对象
//             //     if ((search_result.recordsets[0].features.features.length!=0)&&(search_break==0)){
//             //         switch(serviceResult.result.recordsets[0].datasetName) {
//             //             case 'shuiku@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>设施类别:</b> 水库</p><p><b>AD_CODE:</b>'+ search_properties.AD_CODE +'</p><p><b>DT:</b> '
//             //                     + search_properties.DT +'</p><p><b>GCGM:</b>'+ search_properties.GCGM +'</p><p><b>ID:</b> '+ search_properties.ID +'</p><p><b>名称:</b>'+ search_properties.JC +'</p><p><b>OBJECTID:</b>'+ search_properties.OBJECTID +'</p><p><b>经度:</b>'+ search_properties.X.substring(0,4) +'</p><p><b>纬度:</b>'+ search_properties.Y.substring(0,4) +'</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //             case 'shuizha@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>设施类别:</b>水闸</p><p><b>AD_CODE:</b>'+ search_properties.AD_CODE +'</p><p><b>GCGM:</b> '
//             //                     + search_properties.GCGM +'</p><p><b>ID:</b>'+ search_properties.ID +'</p><p><b>名称:</b>'+ search_properties.名称 +'</p><p><b>经度:</b>'+ search_properties.X.substring(0,4) +'</p><p><b>纬度:</b>'+ search_properties.Y.substring(0,4) +'</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //             case 'renyin@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>名称:</b> 1</p><p><b>地块类别:</b> 1</p><p><b>地块等级:</b> '
//             //                     +'1</p><p><b>所有权性质:</b> 1</p><p><b>实测面积:</b> 1亩</p><p><b>地块编码:</b> 1</p><p><b>所在地:</b> 1</p><p><b>经度:</b> 1</p><p><b>纬度:</b>1</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //             case 'dixiashui@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>设施类别:</b>地下水机井</p><p><b>设施ID:</b>'+ search_properties.OBJECTID +'</p><p><b>经度:</b> '
//             //                     + search_properties.x.substring(0,4) +'</p><p><b>纬度:</b>'+ search_properties.y.substring(0,4) +'</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //             case 'guanquceshui@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>设施类别:</b>灌区测水点</p><p><b>OBJECTID:</b>'+ search_properties.OBJECTID +'</p><p><b>SmID:</b> '
//             //                     + search_properties.SmID +'</p><p><b>经度:</b>'+ search_properties.x.substring(0,4) +'</p><p><b>纬度:</b>'+ search_properties.y.substring(0,4) +'</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //             case 'qudao@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>设施类别:</b> 渠道</p><p><b>AD_CODE:</b>'+ search_properties.AD_CODE +'</p><p><b>DT:</b> '
//             //                     + search_properties.DT +'</p><p><b>id:</b>'+ search_properties.ID +'</p><p><b>名称:</b>'+ search_properties.NAME +'</p><p><b>SmLength:</b>'+ search_properties.SmLength.substring(0,8) +'</p><p><b>是否水渠骨干:</b>暂无信息</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //             case 'tuanchang@Datasource':
//             //                 content.innerHTML = '<div style="display: inline-block;"><p><b>行政区等级:</b>团场</p><p><b>行政区编码:</b>'+ search_properties.XZQDM +'</p><p><b>行政区名称:</b> '
//             //                     + search_properties.XZQMC +'</p>';
//             //                 overlay_water_element.setPosition([x,y]);
//             //                 search_break = 1;
//             //                 break;
//             //         }
//             //     }
//             // }
//
//
//
//         });
//     }
// }


//定义团场位置
var tuan_location = [[82.96894849501648,46.20049665178909],[82.93773294649681,46.64548106147294],[82.89432944021178,46.72728619490434],[82.9463911171981,46.84347294754747],[84.29057480078059,46.86564885633791],[83.58747662277288,46.77266159362212],[83.85366977428393,46.811739429052956],[84.13535536506716,46.80775948904551],[83.92198027348469,46.68285889265468],[84.64947582469527,46.29970133290213]];
//定义团场查找函数
function find_location(id) {
    map.getView().animate(
    {
        duration: 800,
            center: tuan_location[id],
    },{
            zoom: 14
        });

}

//基础要素查询
var element_list = ['element_sk','element_rygc','element_hl','element_ggqd','element_swcz','element_sz','element_jdj','element_gqcsd',];
var element_name_list =['水库名称','人饮工程','河流名称','渠道名称','水文测站','水闸名称','机井名称','灌区测点',] ;
var element_name_title =['水库','人饮工程','河流','渠道','水文测站','水闸','机井','灌区测点',] ;
var element_key = [10,7,9,2,8,5,3,6,];
function elementChange(id) {
    var append_element = 0;
    for (var i=0;i<8;i++){
        if (i==id){
            $("#"+element_list[i]).css("background","#28e5e9cc");
            //设置表格
            table.render({
                elem: '#element_talbe',
                page: true, //是否显示分页
                limit:15,
                limits:[15,],
                url:'waterInfo/getInfo',
                request: {
                    pageName: 'pageNo', //页码的参数名称，默认：page
                    limitName: 'pageSize' //每页数据量的参数名，默认：limit
                },
                where: {key: element_key[id]},
                response: {
                    statusCode: 200 //规定成功的状态码，默认：0
                },
                parseData: function (res) { //res 即为原始返回的数据
                    //定义页码
                    var useful_data = [];
                    for (var i=0;i<res.list.length;i++){
                        useful_data[i]={
                            list:((res.pageNum-1)*10+1)+i,
                            element_name:res.list[i].name,
                            element_detail:'<i class="layui-icon" style="color:#28e5e9;cursor: pointer;" onclick="element_detail(\''+ element_name_title[id] +'详细信息\',\'element_detail.html\','+ id+ ',' + res.list[i].gid +')">&#xe667;</i>',
                            element_location:'<img src="img/nice_location.png" style="cursor: pointer;position: relative;height: 20px;width: 20px;margin-top: 5px;" onclick="find_element_location('+ res.list[i].x + ',' + res.list[i].y + ',\''+ res.list[i].name + '\','+ id + ',' + res.list[i].gid + ',\''+ res.list[i].admin + '\',\''+ res.list[i].depart +'\')"  alt="定位"/>',
                        }
                    }

                    return {
                        "code": 200, //解析接口状态
                        "msg": 'read_success', //解析提示文本
                        "count": res.total, //解析数据长度
                        "data": useful_data //解析数据列表
                    };
                },
                cols: [[{field: 'list', title: '序号', width: '15%', },
                    {field: 'element_name', title: '名称', width: '55%', },
                    {field: 'element_detail', title: '详情', width: '15%', },
                    {field: 'element_location', title: '位置', width: '15%', },

                ]],
                done:function (res, curr, count) {// 表格渲染完成之后的回调
                    $('.layui-laypage-limits').css('display', 'none');
                    $('.layui-laypage-skip').css('display', 'none');
                    $('.layui-table').css("width","100%");
                    $("th[data-field='element_location']").css("border-right",'none');
                },

            });

        }else {
            $("#"+element_list[i]).css("background","#28e5e980");
        }
    }
    if (id==16){
        $("#right_1").css('display','block');
        $("#right_2").css('display','block');
        $("#right_3").css('display','block');
        $("#right_4").css('display','none');
    }else if ((id>7)&&(id<16)){
        layer.msg('暂无该类工程数据信息！', {icon: 7, title:'查询提示'}, function(index){
            //do something
            layer.close(index);
        });
    }

}

//基础要素地图位置显示
function find_element_location(x,y,element_name,id,gid,admin,depart) {
    //填写要素信息
    if (id==2){
        $('#element_complete_time').empty();
        $('#element_complete_time').html('干流长度：159km');
    }else {
        $('#element_complete_time').empty();
        $('#element_complete_time').html('建成时间：暂无信息');
    }
    $('#element_loction').empty();
    $('#element_loction').html('所在位置：'+depart);
    if (element_name.length<10){
        $('#element_name').css('font-size','21px');
        $('#element_popup').css('min-height','150px');
    }else {
        $('#element_name').css('font-size','15px');
        $('#element_popup').css('min-height','160px');
    }
    $('#element_name').empty();
    $('#element_name').html(element_name);
    $('#element_describe').empty();
    $('#element_describe').html(element_name+'位于'+ depart +'，该水利工程管理主体为'+ admin +'...<span style="color: #0C0C0C;font-size: 14px;cursor: pointer;" onclick="element_detail(\''+ element_name_title[id] +'详细信息\',\'element_detail.html\','+ id+ ',' + gid +')">详情<i class="layui-icon" style="color:#09f;cursor: pointer;font-size: 14px;">&#xe64c;</i></span>');

    //地图添加要素信息
    if ($('.ol-overlaycontainer-stopevent').children().length==0){
        overlay_map_element = new ol.Overlay({
            element: location_container,
        });
        map.addOverlay(overlay_map_element);
    }
    overlay_map_element.setPosition([x,y]);
    overlayMapProject.setPosition(undefined);




    //地图中心位置移动
    map.getView().animate({
        duration: 800,
        center: [x,y],
    },{
            zoom: 14
        });

}


//基础要素详情-单独窗口展示
function element_detail(title,url,id,gid) {
    localStorage.setItem('element_gid',gid);
    localStorage.setItem('element_key',element_key[id]);
    var index = layer.open({
        type: 2,
        area: ['1200px', '650px'],
        fix: false, //不固定
        offset:'120px',
        btnAlign: 'c',
        closeBtn:1,
        shadeClose: true,
        shade:0.4,
        title: title,
        content: url,
        success:function (layero, index) {
            //打开界面后的操作
            var body = layer.getChildFrame('body', index);

        },
        cancel: function(index, layero){

        }
    });
}

//监测数据查询
var information_list = ['information_hd','information_sk','information_yq',];
function informationChange(id) {
    var append_element = 0;
    for (var i=0;i<3;i++){
        if (i==id){
            $("#"+information_list[i]).css("background","#28e5e9cc");


        }else {
            $("#"+information_list[i]).css("background","#28e5e980");
        }
    }
    if (id==3){
        $("#right_1").css('display','block');
        $("#right_2").css('display','block');
        $("#right_3").css('display','block');
        $("#right_5").css('display','none');
    }
}

$(document).ready(function(){
    $('#element_popup').css('display','block');
    $('#projectPopup').css('display','block');
});

// //获取相关渠道信息
// var qdId = {
//     id:660906000002,
// };
// var qdInfo = '';

// var normArry = '';
// var normArryT = '';
//轨迹参数
// var option_t = {};
// function normQdInfo(qd) {
//     qdInfo = getQd(qd);
//     var normInfo = [];
//     for (var i=0;i<qdInfo.length;i++){
//         normInfo[i] = { "coords": qdInfo[i].lines, "lineStyle": { "color": "rgb(64,158,255)" } };
//     }
//     console.log(normInfo);
//     option_t = {
//         color:['red'],
//         series: [
//             // {
//             //     type: 'lines',
//             //     blendMode: 'lighter',
//             //     dimensions: ['value'],
//             //     symbol:['arrow', 'arrow'],
//             //     symbolSize:['10', '10'],
//             //     data: normInfo,
//             //     polyline: true,
//             //     large: true,
//             //     animation:false,
//             //     color:'red',
//             //     lineStyle: {
//             //         type: 'solid',
//             //         width: 3,
//             //         shadowColor: 'rgba(0,0,0,0.61)',
//             //         shadowBlur: 10,
//             //         opacity:1,
//             //
//             //
//             //     }
//             // },
//             {
//                 type: 'lines',
//                 coordinateSystem: 'geo',
//                 polyline: true,
//                 data: normInfo,
//                 lineStyle: {
//                     width: 0
//                 },
//                 effect: {
//                     symbol:'image://./img/circleQd.png',
//                     constantSpeed: 30,
//                     show: true,
//                     trailLength: 0.6,
//                     symbolSize: 7,
//                     shadowBlur: 5,
//                     color:'rgb(64,158,255)',
//
//                 },
//                 zlevel: 1
//             },
//
//
//         ]
//     };
// }


//路线示例
// [
//     { "coords": [[116.4383, 40.1471], [116.4372, 40.1458]], "lineStyle": { "color": "#409eff" } },
//     { "coords": [[116.4383, 40.1471], [116.4372, 40.1458]], "lineStyle": { "color": "#409eff" } },
//     { "coords": [[116.4311, 39.9594], [116.4319, 39.9595]], "lineStyle": { "color": "#409eff" } },
//     { "coords": [[116.4311, 39.9594], [116.4319, 39.9595]], "lineStyle": { "color": "#409eff" } }
//     ],


//echarts轨迹追踪
// var echartslayer = new ol3Echarts(option_t, {
//     source: '',
//     destination: '',
//     hideOnMoving: true,
//     forcedRerender: false,
//     forcedPrecomposeRerender: false
// });


// //添加水闸，ol.style是对矢量图层进行设置的
// function creatMarkSz(feature) {
//    return new ol.style.Style({
//         image: new ol.style.Icon(({
//             src: './img/water_resource_lable/sz.png',
//             scale:0.7,
//         })),
//     });
// }
// function creatMarkSzText(feature) {
//     return new ol.style.Style({
//         text: new ol.style.Text({
//             font: '12px Calibri,sans-serif',    //字体与大小
//             fill: new ol.style.Fill({    //文字填充色
//                 color: '#000'
//             }),
//             stroke: new ol.style.Stroke({    //文字边界宽度与颜色
//                 color: '#fff',
//                 width: 3
//             }),
//             textAlign:'center',
//             textBaseline:'middle',
//             text:feature.get('name'),
//             offsetY: -15,
//             // text: `总闸`,
//         })
//     });
// }
//
// //添加分水计量点，ol.style是对矢量图层进行设置的
// function creatMarkFs(feature) {
//     return new ol.style.Style({
//         image: new ol.style.Icon(({
//             src: './img/water_resource_lable/fsjld.png',
//             scale:0.55,
//         })),
//     });
// }
// function creatMarkFsText(feature) {
//     return new ol.style.Style({
//         text: new ol.style.Text({
//             font: '12px Calibri,sans-serif',    //字体与大小
//             fill: new ol.style.Fill({    //文字填充色
//                 color: '#000'
//             }),
//             stroke: new ol.style.Stroke({    //文字边界宽度与颜色
//                 color: '#fff',
//                 width: 3
//             }),
//             textAlign:'center',
//             textBaseline:'middle',
//             text:feature.get('name'),
//             offsetY: -15,
//             // text: `总闸`,
//         })
//     });
// }
//
// //添加灌区测水点，ol.style是对矢量图层进行设置的
// function creatMarkCs(feature) {
//     return new ol.style.Style({
//         image: new ol.style.Icon(({
//             src: './img/water_resource_lable/gqcsd.png',
//             scale:0.25,
//         })),
//     });
// }
// function creatMarkCsText(feature) {
//     return new ol.style.Style({
//         text: new ol.style.Text({
//             font: '12px Calibri,sans-serif',    //字体与大小
//             fill: new ol.style.Fill({    //文字填充色
//                 color: '#000'
//             }),
//             stroke: new ol.style.Stroke({    //文字边界宽度与颜色
//                 color: '#fff',
//                 width: 3
//             }),
//             textAlign:'center',
//             textBaseline:'middle',
//             text:feature.get('name'),
//             offsetY: -15,
//             // text: `总闸`,
//         })
//     });
// }
//
// //添加水文测站，ol.style是对矢量图层进行设置的
// function creatMarkSw(feature) {
//     return new ol.style.Style({
//         image: new ol.style.Icon(({
//             src: './img/water_resource_lable/swcz.png',
//             scale:0.5,
//         })),
//     });
// }
// function creatMarkSwText(feature) {
//     return new ol.style.Style({
//         text: new ol.style.Text({
//             font: '12px Calibri,sans-serif',    //字体与大小
//             fill: new ol.style.Fill({    //文字填充色
//                 color: '#000'
//             }),
//             stroke: new ol.style.Stroke({    //文字边界宽度与颜色
//                 color: '#fff',
//                 width: 3
//             }),
//             textAlign:'center',
//             textBaseline:'middle',
//             text:feature.get('name'),
//             offsetY: -15,
//             // text: `总闸`,
//         })
//     });
// }


// //获取相关水库信息
// //获取相关渠道信息
// var szId = {
//     id:660906000002,
// };
//
// //首先创建水闸图层源文件,以及水渠
// var iconSource_sz = new ol.source.Vector({
//     features:[],
// });
// var iconSource_szText = new ol.source.Vector({
//     features:[],
// });
// var iconSource_sqLine = new ol.source.Vector({
//     features:[],
// });
//
// //首先创建水闸图层,以及水渠
// var iconLayer_sz = new ol.layer.Vector({
//     source: iconSource_sz,
//     zIndex:998,
// });
// var iconLayer_szText = new ol.layer.Vector({
//     source: iconSource_szText,
//     zIndex:998,
// });
// var iconLayer_sqLine = new ol.layer.Vector({
//     source: iconSource_sqLine,
//     zIndex:997,
// });
// //将图层添加至地图
// map.addLayer(iconLayer_sz);
// map.addLayer(iconLayer_szText);
// map.addLayer(iconLayer_sqLine);
//
// //读取后台数据并向，水闸图层添加水闸以及水渠
// var iconFeature_sz = '';
// var iconFeature_szText = '';
// function creat_sz(szId) {
//     var szInfo = getSz(szId);
//     //添加图标图层
//     for (var i=0;i<szInfo.length;i++){
//         iconFeature_sz = new ol.Feature({
//             geometry: new ol.geom.Point([szInfo[i].x,szInfo[i].y]),
//             name:szInfo[i].name,
//         });
//         if(szInfo[i].lx=='水闸'){
//             iconFeature_sz.setStyle(creatMarkSz(iconFeature_sz));
//         }else if (szInfo[i].lx=='分水计量点'){
//             iconFeature_sz.setStyle(creatMarkFs(iconFeature_sz));
//         }else if (szInfo[i].lx=='灌区测水点'){
//             iconFeature_sz.setStyle(creatMarkCs(iconFeature_sz));
//         }else {
//             iconFeature_sz.setStyle(creatMarkSw(iconFeature_sz));
//         }
//
//         iconSource_sz.addFeature(iconFeature_sz);
//     }
//     //添加文字图层
//     for (var i=0;i<szInfo.length;i++){
//         iconFeature_szText = new ol.Feature({
//             geometry: new ol.geom.Point([szInfo[i].x,szInfo[i].y]),
//             name:szInfo[i].name,
//         });
//         if(szInfo[i].lx=='水闸'){
//             iconFeature_szText.setStyle(creatMarkSzText(iconFeature_szText));
//         }else if (szInfo[i].lx=='分水计量点'){
//             iconFeature_szText.setStyle(creatMarkFsText(iconFeature_szText));
//         }else if (szInfo[i].lx=='灌区测水点'){
//             iconFeature_szText.setStyle(creatMarkCsText(iconFeature_szText));
//         }else {
//             iconFeature_szText.setStyle(creatMarkSwText(iconFeature_szText));
//         }
//
//         iconSource_szText.addFeature(iconFeature_szText);
//     }
// }
//
// var polygonQdLine = '';
// var featureQdLine = '';
// function creat_qd(){
//     //渐变色线
//     let styleLine = [];
//     let steps = 4;
//     // 渐变色原理，其实就是多个样式共同使用
//     for (let i = 0; i < steps; i++) {
//         styleLine.push(
//             new ol.style.Style({
//                 stroke: new ol.style.Stroke({
//                     color: [64,158,255, 0.6],
//                     // color: [0, 255, 255, 1 / (steps - i)],
//                     width: (steps - i) - 1
//                 }),
//             })
//         );
//     }
//     for (var i=0;i<qdInfo.length;i++){
//         polygonQdLine = new ol.geom.LineString(qdInfo[i].lines);
//         featureQdLine = new ol.Feature(polygonQdLine);
//         featureQdLine.setStyle(styleLine);
//         iconSource_sqLine.addFeature(featureQdLine);
//     }
//
// }



// //监听地图缩放事件
// map.on("moveend",function(e){
//     var zoom = map.getView().getZoom();  //获取当前地图的缩放级别
//     console.log(zoom);
//     console.log(app_map.value_switch);
//     if ((app_map.value_switch)&&(zoom>13)){
//         iconLayer_sz.setVisible(true);
//
//     }
//     if ((app_map.value_switch_text)&&(zoom>13)){
//
//         iconLayer_szText.setVisible(true);
//
//     }
//     if (zoom<14){
//         iconLayer_sz.setVisible(false);
//         iconLayer_szText.setVisible(false);
//     }
//
// });




//vue相关组件
var firstAddSz = 1;
var zoomSz = 0;
var app_map;
//Vue初始化
app_map = new Vue({
    el: '#app_1',
    data: {
        projectInfo: [
            {
            value: '1',
            label: '水电站'
        }, {
            value: '2',
            label: '骨干渠道'
        }, {
            value: '11',
            label: '斗渠'
        }, {
            value: '3',
            label: '机电井'
        }, {
            value: '5',
            label: '水闸'
        }, {
            value: '6',
            label: '灌区测点'
        }, {
            value: '7',
            label: '人饮工程'
        }, {
            value: '8',
            label: '水文测站'
        }, {
            value: '9',
            label: '河流'
        }, {
            value: '10',
            label: '水库'
        }
        ],
        groupInfo: [
            {
                value: '0',
                label: '九师'
            }, {
                value: '1',
                label: '161团'
            }, {
                value: '2',
                label: '162团'
            }, {
                value: '3',
                label: '163团'
            }, {
                value: '4',
                label: '164团'
            }, {
                value: '5',
                label: '165团'
            }, {
                value: '6',
                label: '166团'
            }, {
                value: '7',
                label: '167团'
            }, {
                value: '8',
                label: '168团'
            }, {
                value: '9',
                label: '169团'
            }, {
                value: '10',
                label: '170团'
            }
        ],
        skName: [
            {
            value: '660906000002',
            label: '小锡泊提水库'
        }, {
            value: '660906000003',
            label: '乌什水库'
        }, {
            value: '660906000004',
            label: '卡因其水库'
        }, {
            value: '660906000005',
            label: '别里奇水库'
        }, {
            value: '660906000006',
            label: '卡尔巴斯水库'
        }, {
            value: '660906000007',
            label: '锡伯特水库'
        }, {
            value: '660906000008',
            label: '卡布尔哈达水库'
        }, {
            value: '660906000009',
            label: '叶其克苏水库'
        }, {
            value: '660906000010',
            label: '卡因达水库'
        }, {
            value: '660906000011',
            label: '乌塔拉克水库'
        }, {
            value: '660906000012',
            label: '乌拉斯台水库'
        }, {
            value: '660906000013',
            label: '哈姆斯沟水库'
        }, {
            value: '660906000014',
            label: '木夫露水库'
        }, {
            value: '660906000015',
            label: '莫葫芦水库'
        }],
        projectDataDetail: [
            {
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            }, {
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },{
                Attributes: '2016-05-02',
                AttributesInfo: '1.2',
            },
        ],
        pickerOptions: {
            shortcuts: [{
                text: '最近一周',
                onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                    picker.$emit('pick', [start, end]);
                }
            }, {
                text: '最近一个月',
                onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                    picker.$emit('pick', [start, end]);
                }
            }, {
                text: '最近三个月',
                onClick(picker) {
                    const end = new Date();
                    const start = new Date();
                    start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                    picker.$emit('pick', [start, end]);
                }
            }]
        },
        projectData: [
            {
                id:'',
                order:'1',
                projectName:'1',
                projectDetail:'1',
                projectSite:'1',
            }
        ],
        valueSkName:'小锡泊提水库',
        projectSelect: '10',
        groupSelect: '0',
        value_switch: false,
        value_switch_text: false,
        skTitleName:'小锡泊提水库渠系测水点',
        czCode:'',
        date1:'',
        currentPage: 1,
        pageSize:14,
        totalPage:400,
        monitorName:'wadiMonitor',
        wadiMonitorData:[
            {
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },{
                id:'',
                order:'1',
                name:'模拟1',
                monitor:'0.2',
            },
        ],
        reservoirMonitorData:[],
        rainMonitorData:[],
        currentPageWadi:1,
        pageSizeWadi:10,
        totalPageWadi:40,
        currentPageReservoir:1,
        pageSizeReservoir:10,
        totalPageReservoir:40,
        currentPageRain:1,
        pageSizeRain:10,
        totalPageRain:40,
        loadingInitProject:'',
        loadingProject:'',
        projectCount:10,
        dialogVisibleReservoir: false,
        dialogTitleReservoir:'一号测站',
        sizeProjectInfo:'',
        reservoirDataInfo:[
            {
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },{
                reservoirName: '1',
                reservoirInfo: '水电站'
            },
        ]



    },
    methods: {
        //页面打开，获取相关表格信息
        handleTableInfo(){
            this.openFullScreen2();
            //获取相关筛选条件
            var projectSelect = this.projectSelect;
            var groupSelect = this.groupSelect;
            //工程名称搜索
            // if (this.nameSearch!=''){
            //     leaderName = this.nameSearch;
            // }
            //显示页码
            //获取当前页码和页内数量,并设置总条数
            var projectObj={
                key:projectSelect,
                pageNo:this.currentPage,
                pageSize:this.pageSize,
            };
            getProjectBase(projectObj);


        },
        projectSelectChange(val){
            this.projectSelect=val;
            this.currentPage=1;
            this.handleTableInfo();
        },
        changeSwitch (s_value) {
            console.log(this.value_switch);
            // zoomSz = map.getView().getZoom();
            // if (s_value){
            //     //隐藏侧边统计
            //     $('.szdd').css('display','none');
            //     $('.baseBoxLeft').css('display','none');
            //     $('.el-select-gc').css('display','none');
            //     $('.fsgxReal').css('display','block');
            //     $('.fsgx').css('display','block');
            //
            //
            //     if (firstAddSz==1){
            //         creat_sz(szId);
            //         creat_qd();
            //         echartslayer.appendTo(map);
            //         echartslayer.setZIndex(1);
            //         firstAddSz=0;
            //         if(zoomSz<14){
            //             iconLayer_sz.setVisible(false);
            //             iconLayer_szText.setVisible(false);
            //         }
            //     }else {
            //         if(zoomSz>13){
            //             iconLayer_sz.setVisible(true);
            //             iconLayer_szText.setVisible(true);
            //         }
            //         echartslayer.show();
            //         iconLayer_sqLine.setVisible(true);
            //     }
            //     this.value_switch_text=true;
            //     $('#qdxs').addClass('qdxsShow');
            //
            // }else {
            //     //显示侧边统计
            //     $('.szdd').css('display','block');
            //     $('.el-select-gc').css('display','block');
            //     $('.fsgxReal').css('display','none');
            //     $('.fsgx').css('display','none');
            //     iconLayer_sz.setVisible(false);
            //     echartslayer.hide();
            //     iconLayer_sqLine.setVisible(false);
            //     this.value_switch_text=false;
            //     iconLayer_szText.setVisible(false);
            //     $('#qdxs').removeClass('qdxsShow');
            // }

        },
        // changeSwitchText (s_value) {
        //     zoomSz = map.getView().getZoom();
        //     if (s_value){
        //         if(zoomSz<14){
        //             iconLayer_szText.setVisible(false);
        //         }
        //         if(zoomSz>13){
        //             iconLayer_szText.setVisible(true);
        //         }
        //     }else {
        //         iconLayer_szText.setVisible(false);
        //     }
        //
        // },
        // changeSkName (SkName) {
        //     console.log(SkName);
        //     this.skTitleName = SkName.label+'渠系测水点';
        //
        //
        // },
        // czOpenedHandle(){
        //     //设置日期选择器时间
        //     var time=new Date();
        //     var year=time.getFullYear(); //获取年份
        //     var month=time.getMonth()+1; //获取月份
        //     var day=time.getDate();  //获取日期
        //     var startDate = year+'-'+month+'-01';
        //     var endDate = year+'-'+month+'-'+day;
        //     this.date1=[startDate,endDate];
        //     //获取测水点测水信息
        //     // var czInfo = {
        //     //     code:this.czCode,
        //     // };
        //     // var czInfoR = getInfoCz(czInfo);
        //     // console.log(this.czData);
        //     // this.czData.value.length = 0;
        //     // console.log(this.czData);
        //     // for (var i=0;i<czInfoR.length;i++){
        //     //
        //     // }
        //
        //     //设置测水点曲线
        //     var dom = document.getElementById("czChart");
        //     var myChart = echarts.init(dom);
        //     var option;
        //
        //     const colors = ['#5470C6', '#91CC75', '#EE6666'];
        //     option = {
        //         color: colors,
        //         tooltip: {
        //             trigger: 'axis',
        //             axisPointer: {
        //                 type: 'cross'
        //             }
        //         },
        //         grid: {
        //             right: '17%',
        //             left:'8%',
        //             bottom:'7%',
        //         },
        //         legend: {
        //             data: ['水量', '流量', '水位']
        //         },
        //         xAxis: [
        //             {
        //                 type: 'category',
        //                 axisTick: {
        //                     alignWithLabel: true
        //                 },
        //                 // prettier-ignore
        //                 data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
        //             }
        //         ],
        //         yAxis: [
        //             {
        //                 type: 'value',
        //                 name: '水量',
        //                 position: 'right',
        //                 alignTicks: true,
        //                 axisLine: {
        //                     show: true,
        //                     lineStyle: {
        //                         color: colors[0]
        //                     }
        //                 },
        //                 axisLabel: {
        //                     formatter: '{value}'
        //                 }
        //             },
        //             {
        //                 type: 'value',
        //                 name: '流量',
        //                 position: 'right',
        //                 alignTicks: true,
        //                 offset: 40,
        //                 axisLine: {
        //                     show: true,
        //                     lineStyle: {
        //                         color: colors[1]
        //                     }
        //                 },
        //                 axisLabel: {
        //                     formatter: '{value}'
        //                 }
        //             },
        //             {
        //                 type: 'value',
        //                 name: '水位',
        //                 position: 'left',
        //                 alignTicks: true,
        //                 axisLine: {
        //                     show: true,
        //                     lineStyle: {
        //                         color: colors[2]
        //                     }
        //                 },
        //                 axisLabel: {
        //                     formatter: '{value}'
        //                 }
        //             }
        //         ],
        //         series: [
        //             {
        //                 name: '水量',
        //                 type: 'bar',
        //                 data: [
        //                     2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
        //                 ]
        //             },
        //             {
        //                 name: '流量',
        //                 type: 'bar',
        //                 yAxisIndex: 1,
        //                 data: [
        //                     2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
        //                 ]
        //             },
        //             {
        //                 name: '水位',
        //                 type: 'line',
        //                 yAxisIndex: 2,
        //                 data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
        //             }
        //         ]
        //     };
        //     if (option && typeof option === "object") {
        //         myChart.setOption(option, true);
        //     }
        // },
        handleCurrentChange(val) {
            this.currentPage = val;
            this.handleTableInfo();
        },
        openNoList() {
            this.$confirm('未查询到此类工程信息!', '提示', {
                confirmButtonText: '确定',
                showCancelButton:false,
                type: 'warning'
            })
        },
        handleProjectLocation(index, row,){
            console.log(row);
            //填写要素信息
            $('#projectPopupname').empty();
            $('#projectPopupname').html(row.name);
            $('#projectPopupDetail').empty();
            //写入工程具体信息
            for(var i=0;i<3;i++){
                $('#projectPopupDetail').append('<tr> <td>1</td> <td>1</td></tr>');
            }

            //地图添加要素信息
            overlayMapProject.setPosition([row.longitude,row.latitude]);
            overlay_map_element.setPosition(undefined);
            //地图中心位置移动
            var lon_3=move_right(row.longitude,row.latitude,45);
            var lat_3=move_top(row.longitude,row.latitude,1200);
            map.getView().animate({
                duration: 800,
                center: [lon_3,lat_3],
            },{
                zoom: 15
            });
        },
        handleProjectInfo(index,row){
            this.dialogVisibleReservoir=true;
            this.dialogTitleReservoir=row.name;

        },
        infoOpenedHandle(){
            console.log(1);
            // setTimeout(function () {
            //     $('.el-table__body-wrapper').css('height','382.4px');
            // }, 50 );





        },
        //加载提示
        openFullScreen2() {
            this.loadingInitProject = this.$loading({
                lock: true,
                text: '正在加载水利工程信息',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });

        },
        //地图点击查询提示
        openFullScreen3() {
            this.loadingProject = this.$loading({
                lock: true,
                text: '正在查询该区域水利工程信息',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });

        },
    }
});

app_map.handleTableInfo();

//渠系关系参数
//获取相关渠道信息
// var csdId = {
//     code:660906000002,
// };
// function controlVue() {
//     //构建渠系关系表,至少存在一级,且本级有且仅有一个
//     //使用if测试
//     var layerAppend='';
//     var relationFs = getListFs(csdId);
//     //一级分水点
//     var layerV0Head = '<el-collapse><el-collapse-item> ';
//     var layerV0Tail = '</el-collapse-item></el-collapse>';
//     var layerV0Body = '<template slot="title">'+relationFs.name+'<div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.count+'</div><div class="iconButton fsgxDiv"><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.name+'\')" @click.stop.prevent="">详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.x+','+relationFs.y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div> </template>';
//     //总的内容
//     var layerV0Content = '';
//     //扩展内容
//     var layerV0ContentT = '';
//     for (var i=0; i<relationFs.maps.length;i++){
//         //二级分水点
//         if (relationFs.maps[i].maps==null){
//             layerV0ContentT = '<div class="fsgxCss"><div class="fsgxDivHead">'+relationFs.maps[i].name+'</div><div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.maps[i].count+'</div><div class="iconButton fsgxDiv" ><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.maps[i].name+'\')" @click.stop.prevent="" >详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.maps[i].x+','+relationFs.maps[i].y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div></div>'
//         }else {
//             //若maps不等于空，则必有一个分水点
//             var layerV1Head = '<div><el-collapse><el-collapse-item>';
//             var layerV1Tail = '</el-collapse-item></el-collapse></div>';
//             var layerV1Body = '<template slot="title">'+relationFs.maps[i].name+'<div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.maps[i].count+'</div><div class="iconButton fsgxDiv" ><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.maps[i].name+'\')" @click.stop.prevent="" >详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.maps[i].x+','+relationFs.maps[i].y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div></template>';
//             //总的内容
//             var layerV1Content = '';
//             //扩展内容
//             var layerV1ContentT = '';
//             for (var j=0; j<relationFs.maps[i].maps.length;j++){
//                 //三级分水点
//                 if (relationFs.maps[i].maps[j].maps==null){
//                     layerV1ContentT = '<div class="fsgxCss"><div class="fsgxDivHead">'+relationFs.maps[i].maps[j].name+'</div><div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.maps[i].maps[j].count+'</div><div class="iconButton fsgxDiv" ><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.maps[i].maps[j].name+'\')" @click.stop.prevent="" >详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.maps[i].maps[j].x+','+relationFs.maps[i].maps[j].y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div></div>'
//                 }else {
//                     //若maps不等于空，则必有一个分水点
//                     var layerV2Head = '<div><el-collapse><el-collapse-item>';
//                     var layerV2Tail = '</el-collapse-item></el-collapse></div>';
//                     var layerV2Body = '<template slot="title">'+relationFs.maps[i].maps[j].name+'<div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.maps[i].maps[j].count+'</div><div class="iconButton fsgxDiv"><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.maps[i].maps[j].name+'\')" @click.stop.prevent="" >详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.maps[i].maps[j].x+','+relationFs.maps[i].maps[j].y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div></template>';
//                     //总的内容
//                     var layerV2Content = '';
//                     //扩展内容
//                     var layerV2ContentT = '';
//                     for (var k=0; k<relationFs.maps[i].maps[j].maps.length;k++){
//                         //三级分水点
//                         if (relationFs.maps[i].maps[i].maps[k].maps==null){
//                             layerV2ContentT = '<div class="fsgxCss"><div class="fsgxDivHead">'+relationFs.maps[i].maps[i].maps[k].name+'</div><div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.maps[i].maps[i].maps[k].count+'</div><div class="iconButton fsgxDiv"><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.maps[i].maps[j].maps[k].name+'\')" @click.stop.prevent="" >详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.maps[i].maps[j].maps[k].x+','+relationFs.maps[i].maps[j].maps[k].y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div></div>'
//                         }else {
//                             //若maps不等于空，则必有一个分水点
//                             var layerV3Head = '<div><el-collapse><el-collapse-item>';
//                             var layerV3Tail = '</el-collapse-item></el-collapse></div>';
//                             var layerV3Body = '<template slot="title">'+relationFs.maps[i].maps[i].maps[k].name+'<div class="fsgxDiv">水位:.1.5</div><div class="fsgxDiv">流量:'+relationFs.maps[i].maps[i].maps[k].count+'</div><div class="iconButton fsgxDiv"><el-button type="primary" icon="el-icon-info" round onclick="fsdInfo(\''+relationFs.maps[i].maps[j].maps[k].name+'\')" @click.stop.prevent="">详情</el-button></div><div class="iconButton fsgxDiv" onclick="fsdLocation('+relationFs.maps[i].maps[j].maps[k].x+','+relationFs.maps[i].maps[j].maps[k].y+')" @click.stop.prevent=""><el-button type="primary" icon="el-icon-location-outline" round >定位</el-button></div></template>';
//                             //总的内容
//                             var layerV3Content = '';
//                             //扩展内容
//                             var layerV3ContentT = '';
//                             layerV2ContentT = layerV3Head+layerV3Body+layerV3Content+layerV3Tail;
//                         }
//                         layerV2Content = layerV2Content+layerV2ContentT;
//                     }
//                     layerV1ContentT = layerV2Head+layerV2Body+layerV2Content+layerV2Tail;
//                 }
//                 layerV1Content = layerV1Content+layerV1ContentT;
//             }
//             layerV0ContentT = layerV1Head+layerV1Body+layerV1Content+layerV1Tail;
//         }
//         layerV0Content = layerV0Content+layerV0ContentT;
//     }
//     layerAppend = layerV0Head+layerV0Body+layerV0Content+layerV0Tail;
//     var myComponent = Vue.extend({
//         template:layerAppend,
//     });
//     new myComponent().$mount('#tableFs');
//
//
//     //$('#tableFs').append(layerAppend);
// }
// controlVue();



//渠系测水点定位
function fsdLocation(long,lat) {
    //地图中心位置移动
    map.getView().animate({
        duration: 800,
        center: [long,lat],
    },{
        zoom: 18
    });
}

//渠系测水点详情
function fsdInfo(czName) {
    app_map.dialogTableVisible = true;
    app_map.dialogTitle = czName;
    //app_map.czCode= czCode;

}

//页面加载完成，进行相关操作
$(document).ready(function () {
    $('.czContent').css('display','block');
    $('.projectTitleLeftCount').css('display','inline-block');
});






